<!--
 * @Author: wangjian
 * 656876071@qq.com
 * @Date: 2024-09-11 15:07:28
 * @LastEditTime: 2024-09-11 15:57:54
 * @FilePath: src/views/sxln/member/WDatePicker.vue
 * @Description: 
 -->
<script setup lang="ts">
import {ref, watch} from "vue";
import type {Dayjs} from "dayjs";
import dayjs from 'dayjs'

const formData = defineModel('value')
const {placeholder} = withDefaults(
    defineProps<{
      placeholder?: string
    }>(), {
      placeholder: '选择日期'
    })
const datePicker = ref<Dayjs | null>()
// 选择后续赋值给form
watch(datePicker, (val) => {
  if (val)
    formData.value = val.format('YYYY-MM-DD hh:mm:ss')
})
// 初始化时赋值给picker
watch(formData, (val) => {
  if (val) {
    const date = formData.value as string
    datePicker.value = dayjs(date)
  } else {
    datePicker.value = null
  }
}, {immediate: true})
</script>

<template>
  <a-date-picker v-model:value="datePicker" :placeholder="placeholder"/>
</template>

<style scoped>

</style>